/**
* @file  Outline
* @author xiao_xie
* @date 2025-03-13
*/


import { DownOutlined } from '@ant-design/icons';
import { Tree, TreeProps } from 'antd';
import React from 'react';
import useComponentStore from '../../../store';

const Outline: React.FC = () => {
  const { components,setCurComponent } = useComponentStore()
  const onSelect: TreeProps['onSelect'] = (selectedKeys) => {
    setCurComponent(Number(selectedKeys[0]))
  };
  return <div>
    <Tree
      showLine
      fieldNames={
        {
          title: 'desc',
          key: 'id',
        }
      }
      autoExpandParent={true}
      switcherIcon={<DownOutlined />}
      defaultExpandedKeys={['0-0-0']}
      onSelect={onSelect}
      treeData={components as any}
    />
  </div>;
};
export default Outline;
